<html>
<head>
    <meta charset="utf-8">
    <title>register</title>
    <script type="text/javascript" src="http://vuejs.org/js/vue.min.js"></script>
    <script type="text/javascript" src="http://unpkg.com/iview/dist/iview.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://unpkg.com/iview/dist/styles/iview.css">
    <link rel="stylesheet" href="https://file.iviewui.com/dev-dist/main.571f0e8d44c31abd00b9.css">
</head>
<body>
<style>
    #login{
        width: 600px;height:700px;margin-left: 35.5%;margin-top:110px;
        background: #ffffff;
        /*box-shadow: 10px 10px 5px 2px #888888;*/
        font-size: 18px;
        border-radius: 5px
    }
    #aa{
        font-size: 18px;
    }
    body
    {
        background-image:url('sign_bg.png');
        background-color: #b8e5f8;
        background-repeat:no-repeat;
        background-size:cover;
        overflow:hidden;
    }
    .loginwin{
        text-align:center;border-bottom:1px solid #e8eaec;padding-bottom:16px;margin-bottom:32px
    }
    .ivu-input-with-prefix {
        padding-left: 32px;
    }
    .ivu-input-large {
        font-size: 14px;
        padding: 6px 7px;
        height: 36px;
    }
    .ivu-input {
        display: inline-block;
        width: 100%;
        height: 32px;
        line-height: 1.5;
        padding: 4px 7px;
        font-size: 12px;
        border: 1px solid #dcdee2;
        border-radius: 4px;
        color: #515a6e;
        background-color: #fff;
        background-image: none;
        position: relative;
        cursor: text;
        transition: border .2s ease-in-out,background .2s ease-in-out,box-shadow .2s ease-in-out;
    }
    .ivu-input-with-prefix {
        padding-left: 32px;
    }
    .ivu-btn-success {
        color: #fff;
        background-color: #39ace3;
        border-color: #39ace3;
    }
    article, aside, blockquote, body, button, dd, details, div, dl, dt, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, input, legend, li, menu, nav, ol, p, section, td, textarea, th, ul {
        margin: 4px;
        padding: 0px;
    }
</style>
<div id="app" class="index">
    <div class="ivu-card-body" id="login">
        <div class="loginwin">
            <img src="./logo2.png" alt="">
            <br><span>请填写注册信息</span>
        </div>
        <form autocomplete="off" class="ivu-form ivu-form-label-top">
            <div class="ivu-form-item ivu-form-item-required">
                <label class="ivu-form-item-label" id="aa">用户名</label>
                <div class="ivu-form-item-content">
                    <div class="ivu-input-wrapper ivu-input-wrapper-large ivu-input-type">
                        <!----> <!---->
                        <i class="ivu-icon ivu-icon-ios-loading ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                        <input autocomplete="off" spellcheck="false" type="text" placeholder="" class="ivu-input ivu-input-large ivu-input-with-prefix">
                        <span class="ivu-input-prefix"><Icon type="md-contact" size="24"></Icon></span>
                    </div> <!----></div>
            </div><div class="ivu-form-item ivu-form-item-required">
            <label class="ivu-form-item-label" id="aa">密码</label>
            <div class="ivu-form-item-content">
                <div class="ivu-input-wrapper ivu-input-wrapper-large ivu-input-type"><!---->
                    <i class="ivu-icon ivu-icon-ios-eye ivu-input-icon ivu-input-icon-normal"></i> <!---->
                    <input autocomplete="off" spellcheck="false" type="password" placeholder="" class="ivu-input ivu-input-large ivu-input-with-prefix"> <span class="ivu-input-prefix">
                    <Icon type="md-lock" ></Icon>
                </span>
                </div> <!---->
            </div>
        </div>
        </form> <div id="vaptcha_container">
        <div class="vp-basic-btn vp-dark-btn vp-default-btn vp-waves" style="background-color: rgb(45, 140, 240);"><div class="vp-btn-bg"></div>
            <div class="vp-basic-cont">
                <div class="vp-shield vp-vertical">
        <span class="vp-vertical-cont">
            <i class="vp-circle-i"></i>
            <!--hover 圆缩放-->
            <span class="vp-circle-h"></span>
        </span>
                    <div class="vp-prompt vp-match"><span class="vp-btn-hover-message"></span>
                        <span class="vp-prompt-triangle"></span></div><div class="vp-prompt vp-safety"><span class="vp-safety-fator"></span>
                    <span class="vp-prompt-triangle"></span></div></div>
                <a class="vp-about vp-vertical" href="https://www.vaptcha.com/" title="了解VAPTCHA" target="_blank" style="display: none;">
        <span class="vp-vertical-cont">
            <i></i>
        </span>
                </a>
            </div>
        </div>
    </div>
        <div class="dev-sign-main-aside"><button type="button" class="ivu-btn ivu-btn-success ivu-btn-long ivu-btn-large"><!---->
            <i class="ivu-icon ivu-icon-md-log-in"></i>
            <span>注册</span></button>
        </div>
    </div>
</div>
<script>
    var app=new Vue({
        el: '#app',
        data(){
            return {
                theme1:'light',
            }
        }
    })
</script>
</body>
</html>